<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
  <script>
    let pro = new Promise((resolve, reject) => {
      if (false) {
        //调用操作成功方法
        resolve("操作成功");
      } else {
        //调用操作异常方法
        reject("操作异常");
      }
    });

    //用then处理操作成功，catch处理操作异常
    pro.then(requestA).then(requestB).then(requestC).catch(requestError);

    function requestA() {
      console.log("请求A成功");
      return "请求B，下一个就是你了";
    }
    function requestB(res) {
      console.log("上一步的结果：" + res);
      console.log("请求B成功");
      return "请求C，下一个就是你了";
    }
    function requestC(res) {
      console.log("上一步的结果：" + res);
      console.log("请求C成功");
    }
    function requestError() {
      console.log("请求失败");
    }
    //打印结果：
    //请求A成功
    //上一步的结果：请求B，下一个就是你了
    //请求B成功
    //上一步的结果：请求C，下一个就是你了
    //请求C成功
  </script>
  <script>
    // Promise.all( )方法：接受一个数组作为参数，
    // 数组的元素是Promise实例对象，当参数中的实例对象的状态都为fulfilled时，Promise.all( )才会有返回。
    //创建实例pro1
    let pro1 = new Promise(function (resolve) {
      setTimeout(function () {
        resolve("实例1操作成功");
      }, 2000);
    });

    //创建实例pro2
    let pro2 = new Promise(function (resolve, reject) {
      setTimeout(function () {
        resolve("实例2操作成功");
      }, 1000);
    });

    Promise.all([pro1, pro2])
      .then(function (result) {
        console.log(result);
      })
      .catch(function (error) {
        console.log(error);
      });
  </script>
  <script>
   // Promise.race()方法：它的参数要求跟Promise.all( )方法一样，不同的是，
    // 它参数中的promise实例，只要有一个状态发生变化（不管是成功fulfilled还是异常rejected），它就会有返回
    let pro11 = new Promise(function (resolve) {
      setTimeout(function () {
        resolve("实例1操作成功");
      }, 1000);
    });
    //初始化实例pro2
    let pro21 = new Promise(function (resolve, reject) {
      setTimeout(function () {
        reject("实例2操作失败");
      }, 2000);
    });

    Promise.race([pro2, pro1])
      .then(function (result) {
        console.log(result);
      })
      .catch(function (error) {
        console.log(error);
      });
    //打印结果：实例2操作失败
  </script>
</html>

